<template>
	<!-- 我的族谱 -->
	<!-- userInfo.is_shaikh==1 -->
	<view class="myzupu" :style="{backgroundImage:'url('+photo_cdn1+'zpupload/20240102/3ca9906e8f012aab0c.png)'}" >
		<!-- <view class="navbarmin" >
			<view class="ordertabbar ordertabbartwo flex ali-c jus-a" >
				<view class="tabitems actives"  >我的族谱</view>
				<navigator class="tabitems" url="/pages/findpu/findpu" open-type="redirect" hover-class="none">寻谱</navigator>
				<navigator class="tabitems"  url="/pages/celebrity/celebritylist/celebritylist" open-type="redirect" hover-class="none" >名人馆</navigator>
			</view>
		</view> -->
		
		<view class="scroll_people" v-show="m_zupu_list.length">			
			<view @tap="tabFamily(item)" v-for="(item,index) in m_zupu_list" :key="index" hover-class="none" class="zupus_item flex ali-c" >
				<view class="peag" v-if="item.type==2">
					<image class="people_flag" :src="photo_cdn1 + 'zpupload/static/zupu/lable1.png'"></image>
					<view class="peag_text">族</view>
				</view>
				<view class="peag" v-if="item.type==1">
					<image class="people_flag" :src="photo_cdn1 + 'zpupload/static/zupu/lable2.png'"></image>
					<view class="peag_text">家</view>
				</view>
				<view class="peag" v-if="item.type==3">
					<image class="people_flag" :src="photo_cdn1 + 'zpupload/static/zupu/lable.png'"></image>
					<view class="peag_text">宗</view>
				</view>
				<view class="itemimgss">
					<image class="zpimgs" :style="{backgroundImage:'url('+photo_cdn1+'zpupload/static/zupu/pushu.png)'}" mode=""></image>
					<view class="family_name">{{item.family_name}}{{ item.type|format_pu_type}}</view>
				</view>
				<view class="zupus_item_info flex1">
					<view class="zupu_names">{{item.family_name}}{{ item.type|format_pu_type}}</view>
					<view class="flex ali-c jus-b fqr_text">
						<view class="">发起人：{{item.realname}}</view>
						<!-- <view @tap.stop="contactInheritorn(item)" v-if="item.fastim_id" class="contactccr">联系第一传承人</view> -->
					</view>
					<!-- <view class="rprs_text">入谱人数：{{item.join_number}}</view> -->
					<view class="create_time">创建日期：{{item.createtime  }}</view>
					
					<view class="item_info_foot flex ali-c">
						<!-- <image class="tximgs" src="https://img.alicdn.com/imgextra/i2/1937263177/O1CN01L73tC01ZL7BFYhetI_!!1937263177.jpg" mode=""></image>
						<view class="inheritors"><text class="tt_line">曹永寿</text>（传承人）</view> -->
						<view class="punumtext">入谱人数：{{item.join_number}}</view>
					</view>
					<!-- <view class="create_time">地址：{{item.province?item.province:''}}{{item.city?item.city:''}}{{item.area?item.area:''}}{{item.town?item.town:''}}{{item.address}}</view> -->
				</view>
			</view>
		</view>
		
		<empty v-if="m_zupu_list.length==0"></empty>
		<view class="no_list" v-if="m_zupu_list.length==0">
			<view class="point_out">您还没有加入任何族谱，快去加入吧~</view>
		</view>
		
		<!-- <view  class="carete_zupu" v-show="userInfo.is_shaikh == 1">
			<view class="carete_zupu_foot">
				<view class="carete_zupu_btn">确认切换</view>
			</view>
		</view> -->			
	</view>
</template>

<script>
	// import {getFamilyList} from "@/utils/api/zupu.js";//旧的
	import {familyList} from "@/utils/api/zupu.js";//新
	import {getUserinfo} from "@/utils/api/api.js";
	import config from "@/utils/config.js";
	let {staticurl,photo_cdn1} = config.baseUrl;
	export default {
		data() {
			return {
				staticurl,
				photo_cdn1,
				tab_source:1,//1我的族谱，2创建族谱
				statusBarHeight:0,
				m_zupu_list:[],
				page:0,
				isshowall:false,
				scrollHeight:0,
				btn_height:0,
				nav_height:0,
				userInfo:{},
				
			}
		},
		onLoad() {
			this.statusBarHeight = uni.getSystemInfoSync().statusBarHeight * 2;
			this.getUserinfofun();
			this.$nextTick(()=>{
				this.computeheight()
			})
		},
		onShow() {
			// this.isshowall = false;
			// this.page = 0;
			// this.m_zupu_list = [];
			this.getFamilyListfun();
		},
		methods: {
			//获取用户信息
			getUserinfofun(){
				getUserinfo({
					
				}).then((res)=>{
					this.userInfo = res.data.userinfo;
					uni.setStorageSync("u_userInfo",res.data.userinfo);
				})
			},
			//切换 tab
			taggle_type(type){
				this.tab_source = type;
				this.getFamilyListfun();
			},
			getFamilyListfun(){
				// this.page++;
				familyList({
					source:this.tab_source,
					// page:this.page,
				}).then((res)=>{
					if(res.code==1){
						
						this.m_zupu_list = res.data;
						
						// this.m_zupu_list = [...this.m_zupu_list,...res.data.list];
						// if(res.data.list.length==0){
						// 	this.isshowall = true;
						// }
					}else{
						// this.isshowall = true;
					}
				})
			},
			//计算高度
			computeheight(){
				let resinfo = uni.getSystemInfoSync();
				let windowHeight = resinfo.windowHeight;
				let query = uni.createSelectorQuery().select(".carete_zupu");
				query.boundingClientRect((data)=> {
					// this.btn_height = data.height;
					let scrollheight = windowHeight - this.btn_height;
					this.scrollHeight = scrollheight;
				}).exec();
			},
			//切换族谱
			tabFamily(item){
				uni.navigateTo({
					url:`/pages/zupu/familytrees/familytrees?family_id=${item.id}`
				})
			},
			//联系传承人
			contactInheritorn(item){
				uni.navigateTo({
					url:`/pagesim/center/info?id=${item.fastim_id}`
				})
			}
		}
	}
</script>

<style lang="scss">
	@import "./myzupu.scss";
</style>
